{extend name="base/base" /}
{block name="style"}
<style type="text/css">

</style>
{/block}
{block name="content"}
  <div class="layui-form-item layui-form-pane">
      <div class="layui-inline">
            <label class="layui-form-label">状态</label>
            <div class="layui-input-inline">
          <select class="layui-input" name='status' id='status'>
            <option value="">全部</option>
            <option value="1">挂卖中</option>
            <option value="2">用户撤回</option>
            <option value="3">已完成</option>
          </select>
            </div>
      </div>
      <div class="layui-inline">
        <label class="layui-form-label">用户ID</label>
          <div class="layui-input-inline">
            <input type="text" name="uid" autocomplete="off" class="layui-input" id='uid'>
          </div>
      </div>
      <div class="layui-inline">
          <label class="layui-form-label">用户名</label>
          <div class="layui-input-inline">
              <input type="text" name="username" autocomplete="off" class="layui-input" id='username'>
          </div>
      </div>
      <div class="layui-inline">
          <label class="layui-form-label">币种</label>
          <div class="layui-input-inline">
              <input type="text" name="coin_name" autocomplete="off" class="layui-input" id='coin_name'>
          </div>
      </div>
      <div class="layui-inline">
        <div class="demoTable">
          <button class="layui-btn" data-type="reload">搜索</button>
        </div>
      </div>
  <table id="table" lay-filter="table"></table> 
  <script type="text/html" id="edit">
    <a class="layui-btn layui-btn-xs" lay-event="cancel">取消交易</a>
  </script>
</div>
{/block}
{block name="script"}
<script>
layui.use(['table', 'laydate'], function(){
  var table = layui.table;
  var laydate = layui.laydate;
  table.render({
    elem: '#table'
    ,height: 'full-200'
    ,url: '/admin/trade/sellList/' //数据接口
    ,limit:20
    ,page: true //开启分页
    ,id:'reload'
    ,cols: [[ //表头
      {field:'uid', title: '用户ID', width: 100 }
      ,{field:'username', title: '用户名', width: 150 }
      ,{field:'coin_name', title: '卖出币种', width: 150}
      ,{field:'amount', title: '卖出数量', width: 150}
      ,{field:'left_amount', title: '剩余数量', width: 150}
      ,{field:'price', title: '卖出价格', width: 150}
      ,{field:'rate', title: '手续费比例', width: 150}
      ,{field:'fee', title: '手续费', width: 150}
      ,{field:'status', title: '状态', width: 200,templet: function(d){
          if (d.status == 1) {
            return '<span style="color:blue">挂卖中</span>'
          } 
          if (d.status == 2) {
            return '<span style="color:green">已撤销</span>'
          }
          if (d.status == 3) {
            return '<span style="color:red">已完成</span>'
          } 
      }}
      ,{field:'date', title: '挂卖时间', width: 300}
      ,{title: '操作', toolbar: '#edit', width: 200}
    ]]
  }); 
     //编辑 删除
  table.on('tool(table)', function(obj){
    var data = obj.data;
    //编辑
    if(obj.event === 'cancel'){
      layer.confirm('订单将退回，不可逆，确定操作？', function(index){
        var post_data = {
        	'uid':data.uid,
          	'id':data.id
        }
        $.ajax({
          url:"{:url('admin/trade/cancel2')}",
          type:'POST',
          data:post_data,
          success:function(ret){
            if(ret.code == 0) {
              layer.msg('操作成功');
              $(".layui-laypage-btn")[0].click();
              obj.del();
            } else {
              layer.msg(ret.msg);
            }
          }
        });
      });
    }
  });
  // 搜索
  var $ = layui.$, active = {
        reload: function(){
            table.reload('reload', {
                where: {
                    status: $('#status').val(),
                    uid: $('#uid').val(),
                    coin_name: $('#coin_name').val(),
                    username: $('#username').val(),
                }
            });
        }
    };
    $('.demoTable .layui-btn').on('click', function(){
    var type = $(this).data('type');
    active[type] ? active[type].call(this) : '';
  });
});
</script>
{/block}
